<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>13 自定义过滤器</title>
    <script src="../js/vue.min.js"></script>
</head>
<body>
<div id="app">
    <h1>全局过滤器</h1>
    {{ 100 | addZero}}
    <hr>
    <h1>获取当前时间</h1>
    {{nowTime | dateformat }}

    <hr>
    <h1>保留两位小数</h1>
    <h3>{{12.345678 | number_flot(2)}}</h3>

</div>
<script>
    /**
     * 自定义全局过滤器
     */

    Vue.filter('addZero', function (data) {
        console.log(data);
        return data < 200 ? '0' + data : data;
    });
    Vue.filter('dateformat', data => {
        let d = new Date(data);
        return d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
    });


    let vm = new Vue({
        el: "#app",
        data() {
            return {
                msg: 'hello world',
                nowTime: Date.now()
            }
        },
        //    局部过滤器
        filters:{
            number_flot:(data,n) => {
                return data.toFixed(n);
            }
        }
    })
</script>
</body>
</html>